<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>修改用户信息</title>
    <script type="text/javascript" th:src="@{/js/jquery-3.6.1.min.js}"></script>
</head>
<body>
<h2>修改用户信息页</h2>

<form method="post" th:action="@{/user/update}">
    编号：<span th:text="${user.id}"></span> <br>
    <input type="hidden" name="id" th:value="${user.id}">
    昵称<input type="text" th:value="${user.nickname}" name="nickname"/> <br>
    头像：
    <img th:src="${#strings.replace(user.avatar,'s.j','.j')}">
    <br>
    性别：
    <input type="radio" name="gender" value="1" th:checked="${user.gender}">男
    <input type="radio" name="gender" value="0" th:checked="!${user.gender}">女
    <br>
    生日：<input type="text" th:value="${user.birth}" name="birth"/> <br>
    邮箱：<input type="text" th:value="${user.email}" name="email"/> <br>
    电话：<input type="text" th:value="${user.phone}" name="phone"/> <br>
    账户：<input type="text" th:value="${user.account}" name="account"/> <br>
    密码：<input type="text" th:value="${user.password}" name="password"/> <br>
    状态：
    <input type="radio" name="state" value="0" th:checked="${user.state==0}">已删除
    <input type="radio" name="state" value="1" th:checked="${user.state==1}">正常
    <input type="radio" name="state" value="2" th:checked="${user.state==2}">功能受限
    <input type="radio" name="state" value="3" th:checked="${user.state==3}">活跃
    <br>
    注册时间：<input type="datetime-local" th:value="${user.createTime}" name="createTime"/> <br>
    最后一次修改时间：<input type="datetime-local" th:value="${user.updateTime}" name="updateTime"/> <br>

    <input type="submit" value="修改用户信息">
</form>

<br><br><br><br><br>
<input type="file" name="file" id="file">
<button id="btn">上传头像</button>
<br><br><br><br><br>

<script type="text/javascript">
    $("#btn").click(function () {
        let files = $("#file")[0].files;
        let formData = new FormData();
        formData.append('file', files[0]);
        // formData.append('path', 'd:/abcd/efg') //测试用
        $.ajax({
            url: "/fileUpload",
            method: "post",
            //不修改contentType,使用FormData默认的
            contentType: false,
            //不对FormData中的数据进行url编码，而是将FormData数据原样上传到服务器
            processData: false,
            data: formData,
            success: function (res) {
                if (res == 'success') {
                    alert('头像上传成功');
                } else {
                    alert('头像上传失败');
                }
            }
        })
    });
</script>

<a th:href="@{/user/list}">用户列表</a>
</body>
</html>